<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>数字翻页滚动</title>
</head>
<body>
<div id="app">
    <div class="number-container">

    </div>
</div>

<script>
    function incrementCounter(counterId, targetNumber, duration = 2000) {
        const startTime = Date.now();
        const startNumber =  0; // 获取当前显示的数字，如果没有则默认为0
        const incrementAmount = (targetNumber - startNumber) / duration; // 计算每毫秒递增的量

        const intervalId = setInterval(() => {
            const elapsed = Date.now() - startTime;
            let currentNumber = startNumber + incrementAmount * elapsed;

            if (elapsed >= duration) {
                currentNumber = targetNumber;
                clearInterval(intervalId);
            }

            console.log( Math.floor(currentNumber))
        }, 10); // 每10毫秒更新一次，可以根据需要调整
    }

    incrementCounter('purchase_number', 152);
    incrementCounter('purchase_number', 15210);

</script>
</body>
</html>
